<template>
  <div class="AuthorizationIndex">
    <jxtech-basic-header>
      <template #extra>
        <!-- <jxtech-delete-button></jxtech-delete-button> -->
      </template>
    </jxtech-basic-header>

    <jxtech-page-table ref="AuthorizationTableRef" row-key="ruleCode" fit="full" :table-column="AuthorizationIndexState.tableColumn"
                       :load-data="AuthorizationIndexState.loadData" :exp-data="AuthorizationIndexState.expData"
                       @selection-change="AuthorizationIndexState.tableSelectionChange">
      <template #header>
        <div class="jxtech-page-table-header-flex">
          <jxtech-search-form :query-column="AuthorizationIndexState.queryColumn" :query-form="AuthorizationIndexState.queryParam" :col-span="6"
                              @handle-search="AuthorizationIndexState.handleSearch">

          </jxtech-search-form>
        </div>
      </template>

      <template #actionSlot="{ row }">
        <el-button type="">
          <jxtech-svg-icon icon="#icon-detail" class="pointer"></jxtech-svg-icon>&nbsp;详 情
        </el-button>
        <el-divider direction="vertical"></el-divider>
        <el-button type="danger">
          <jxtech-svg-icon icon="#icon-delete" class="pointer"></jxtech-svg-icon>&nbsp;删 除
        </el-button>
      </template>

    </jxtech-page-table>
  </div>
</template>

<script lang="ts" setup>
import { reactive, ref, onMounted } from "vue"
import authorizationServiceApi from "/@/api/personnel/bean/authorization"
const AuthorizationTableRef = ref()
const AuthorizationIndexState = reactive({
  handleSearch: () => AuthorizationTableRef.value.loadTable(),
  queryColumn: [
    {
      name: "ruleCode",
      type: "input",
      label: "规则编码",
      placeholder: "规则编码"
    }
  ],
  queryParam: { likeAll: null },
  selectionData: [] as any[],
  tableColumn: [
    { label: "序号", width: "50", type: "selection" },
    { label: "序号", width: "50", type: "index" },
    // { prop: "", label: "对接系统名称" },
    { prop: "loginid", label: "资源账号" },
    { prop: "password", label: "密码" },
    { prop: "dept", label: "数据提供部门" },
    { prop: "username", label: "联系人" },
    { prop: "phoneNumber", label: "电话" },
    { prop: "", label: "操作员" },
    { prop: "createDate", label: "申请时间" },
    { label: "操作", slot: "actionSlot", width: "200" }
  ],
  //表格数据加载的方法
  loadData: (params: any) => {
    return authorizationServiceApi.queryPage(
      { refCols: "default" },
      {
        ...params,
        ...AuthorizationIndexState.queryParam
      }
    )
  },
  expData: (params: any) => {
    // return rulelibraryServiceApi.exportData(null, {
    //   ...params,
    //   ...InspectListComState.queryParam
    // })
  }
})
onMounted(() => {
  AuthorizationTableRef.value.loadTable()
})
</script>

<style lang="scss" scoped>
</style>
